/**
 * Created by jiadx on 2015/11/16.
 */
define(['ionic'], function () {
    angular.module('SalesShipments.directives', [])
        .factory("alignSvc", function () {
            return {
                pos: function (element, tooltip, align) {
                    var elHeight = element[0].clientHeight;
                    var elWidth = element[0].clientWidth;
                    var ttWidth = tooltip[0].clientWidth;
                    var ttHeight = tooltip[0].clientHeight;
                    var elPos = {
                        top: element[0].offsetTop,
                        left: element[0].offsetLeft
                    };
                    switch (align) {
                        case 'left':
                            pos = {
                                top: elPos.top + elHeight / 2 - ttHeight / 2,
                                left: elPos.left - ttWidth
                            };
                            break;
                        case 'right':
                            pos = {
                                top: elPos.top + elHeight / 2 - ttHeight / 2,
                                left: elPos.left + elWidth
                            };
                            break;
                        case 'bottom':
                            pos = {
                                top: elPos.top + elHeight,
                                left: elPos.left + elWidth / 2 - ttWidth / 2
                            };
                            break;
                        default: //top
                            pos = {
                                top: elPos.top - ttHeight,
                                left: elPos.left + elWidth / 2 - ttWidth / 2
                            };
                            break;
                    }
                    return pos;
                }
            }
        })
        .factory('splitNumber', function () {
            return function (content) {
                return content ? content.replace(/\s/g, '').replace(/(\d{4})(?=\d)/g, "$1 ") : content;
            }
        })
        .directive("bpTooltip", function ($compile, alignSvc, splitNumber) {
            var template =
                '<div class="tooltip">' +
                '<p>{{messages}}</p>' +
                '</div>';
            return {
                scope: {
                    message: '=ngModel'
                },
                require: 'ngModel',

                link: function (scope, element, attrs) {
                    var tooltip;
                    var align = attrs.bpTooltipAlign;

                    scope.$watch('message', function (value) {
                        if (value) {
                            scope.messages = splitNumber(value.toString());
                        }
                    });

                    function remove() {
                        if (tooltip) {
                            tooltip.remove();
                            tooltip = null;
                        }
                    }

                    function show() {
                        tooltip = angular.element(template);
                        $compile(tooltip)(scope);
                        scope.$apply();
                        element.after(tooltip);
                        var pos = alignSvc.pos(element, tooltip, align);
                        tooltip.css({top: pos.top, left: pos.left});
                        tooltip.hide;
                    }

                    element.bind('focus', function () {
                        remove();
                        show();
                    });
                    element.bind('blur', function () {
                        remove();
                    });
                }
            }
        })
});